<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" >
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/sytle.css">
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-2.1.4.min.js"></script>
		<title>优惠券</title>
	</head>
	<body style="background: #f1f1f1;">
		<div class="page">
			<ul class="yhj_list">
			<c:forEach items="${MEMBER_COUPON_LIST}" var="coupon">
				<li onclick="use(${coupon.id})">
					<div class="yhj_list_top clearfix">
						<div class="yhj_list_money">${coupon.wMcMoney}</div>
						<div class="yhj_list_txt">
							<p>${coupon.wMcCouponTitle}</p>
							<p>${coupon.wMcDesc}</p>
						</div>
						<div class="yhj_choose"><i></i></div>
					</div>
					<p class="yhj_yxq">有效期至：<span><fmt:formatDate value="${coupon.wMcDeadline}"  type="BOTH" dateStyle="full"/></span></p>
				</li>
			</c:forEach>
			</ul>
			<div class="mask">
				<div class="popup">
					<h3 class="popup_title">确定要使用这张优惠券吗？</h3>
					<div class="popup_choose clearfix">
						<a href="" class="popup_choose_cancel">取消</a>
						<a href="javascript:void();" onclick="useMemberCoupon()" class="popup_choose_sure">确定</a>
					</div>
				</div>
			</div>
		</div>
		<script>
			var couponId = 0;
			function use(id){
				couponId = id;
				$(".yhj_list li .yhj_choose i").removeClass("selected");
				$(this).addClass("selected").siblings().removeClass("selected");
			}

			$(function(){
				$(".yhj_choose i").on("click",function(){
					$(".mask").show()
				})
				$(".popup_choose_cancel").on("click",function(){
					$(".mask").hide()
				})
			})
			
			function useMemberCoupon() {
				window.location.href= "${pageContext.request.contextPath}/members/useMemberCoupon/" +couponId + ".html";
			}

		</script>
	</body>
</html>
